import React, { useCallback } from "react"
import { Field_FormSave, Field_name_id } from "@/components/utils/field.list"
import { FormProps } from "@/components/modal/form.modal"
import { FileExtMeta, FormRender, FormUpload } from "@whzhuke/antd"
import useForm from "antd/es/form/hooks/useForm"
import { Form, InputNumber, Select, Space } from "antd"
import baseSystem from "@/services/base.system"
import hetongService from "@/services/hetong.service"

interface Props {
  values?: any
}

// 交付期单位选项：1=天，2=月
const deliveryUnitOptions = [
  { label: "天", value: 1 },
  { label: "月", value: 2 }
]

export const ConfirmHetong: React.FC<Props & FormProps> = props => {
  const { values, onDone } = props
  const [form] = useForm<any>()

  const onFinish = useCallback(
    data => {
      hetongService.confirm({ ...data, id: values?.id }).then(res => {
        onDone?.()
      })
    },
    [values, onDone]
  )

  return (
    <FormRender
      form={form}
      initialValues={
        values
          ? {
              ...values
            }
          : {
              deliveryUnit: 1
            }
      }
      onFinish={onFinish}
      fieldList={[
        values ? Field_name_id : undefined,
        {
          fieldType: "input",
          formItemConfig: { required: !0, name: "code", label: "合同编号" },
          config: { placeholder: "合同编号" }
        },
        {
          fieldType: "input",
          formItemConfig: { required: !0, name: "code", label: "合同名称" },
          config: { placeholder: "合同名称" }
        },
        {
          fieldType: "diy",
          formItemConfig: { required: !0, label: "交付期" },
          component: (
            <Space>
              <Form.Item name="delivery" noStyle rules={[{ required: true, message: "请输入交付期数字" }]}>
                <InputNumber placeholder="请输入交付期数字" min={0} precision={0} style={{ width: 120 }} />
              </Form.Item>
              <Form.Item name="deliveryUnit" noStyle rules={[{ required: true, message: "请选择交付期单位" }]}>
                <Select placeholder="请选择交付期单位" options={deliveryUnitOptions} style={{ width: 120 }} />
              </Form.Item>
            </Space>
          )
        },
        {
          fieldType: "diy",
          formItemConfig: {
            name: "imgPath",
            label: "商品图片",
            required: !0,
            rules: [{ required: !0, message: "点击上传" }],
            normalize: v => v[0]
          },
          component: (
            <FormUpload
              apiService={baseSystem.upload}
              accept={FileExtMeta.image.toString()}
              allowFile="thumbnail"
              assetKey="public"
              apiParams={{ businessType: 4 }}
            />
          )
        },
        { ...Field_FormSave, formItemConfig: { wrapperCol: { offset: 8, span: 16 } } }
      ]}
      autoComplete="off"
    />
  )
}
